<template>
  <div>
    <van-action-sheet
      v-model="isShow"
      :actions="tableData"
      cancel-text="取消"
      :description="tableData.length ? '' : '暂无可选人员'"
      @select="submitSelectTable"
    />
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex';

import {
  api_GET_EventsManagementEntryDelegationCandidatesForEntry // 查询注册列表
} from '@/extend/api/gameswaggerApi/app';
import {
  Api_GET_EventsManagementEntryDelegationCandidatesForEntryQO // 查询注册列表
} from '@/lib/form/game/swaggerForm';

export default {
  props: {
    title: {
      type: String,
      default: '运动员选择'
    },
    gameInfo: {
      type: Object,
      default () {
        return {};
      }
    },
    userInfo: {
      type: Object,
      default () {
        return {};
      }
    },
    requiredIdData: {
      type: Object,
      default () {
        return {};
      }
    }
  },
  data () {
    const _qo = new Api_GET_EventsManagementEntryDelegationCandidatesForEntryQO();
    _qo.HasPhoto = '';
    return {
      isShow: false,
      qo: _qo,
      tableData: [{ name: '加载选项', loading: true }],
      total: 0
    };
  },
  computed: {
    ...mapState({
      dict: state => state.dict.dict
    }),
    genderDictMap() {
      const _returnData = {};
      this.dict.gender.forEach(item => {
        _returnData[item.code] = item;
      });
      return _returnData;
    }
  },
  watch: {
    isShow(val) {
      if (val) {
        this.qo.CompetitionId = this.gameInfo.id;
        this.qo.DelegationId = this.requiredIdData.delegationId;
        delete this.qo.SkipCount;
        delete this.qo.MaxResultCount;
        delete this.qo.Page;
        this.getAthleteList();
      } else {
        this.tableData = [{ name: '加载选项', loading: true }];
      }
    }
  },
  created() {
    this.getDict();
  },
  methods: {
    ...mapActions({ getDict: 'dict/getDict' }),
    open () {
      this.isShow = true;
    },
    close () {
      this.isShow = false;
    },
    // 获取运动员列表
    getAthleteList () {
      api_GET_EventsManagementEntryDelegationCandidatesForEntry(this.qo)
        .then(
          res => {
            const _res = res.items || [];
            this.tableData = _res.map(item => {
              item._name = item.name;
              const genderName = item.genderCode === 'M' ? '男' : '女';
              item.name = `${item.name} (${genderName})`;
              return item;
            });
            this.total = res.totalCount;
          }
        )
        .catch(
          error => {
            this.$toast.fail(`报项列表获取失败！ ${error.error.message}`);
          }
        );
    },
    // 确认选择表格
    submitSelectTable (data) {
      data.name = data._name;
      this.$emit('onSubmitAthlete', data);
      this.close();
    }
  }
};
</script>
